Practical Responsive Typography by Dario Calonaci

Author:Dario Calonaci [Calonaci, Dario]
Language: eng
Format: azw3
Publisher: Packt Publishing
Published: 2016-07-28T04:00:00+00:00

As we know, 1em is equal to 16px. So, having decided, for example, our primary header will be 32px high, the transformation in rems is quite simple:

32 / 16 = 2 or 2rem

We'll just have to write down the following:

h1 { font-size: 2rem; }

Our header is now the desired size.

But what if the h1 is contained, let's say, in an article, which we forgot that we set to 0.625rem, clearly referring to the standard text in it and not to the headers?

Well that's a no-brainer and not a problem, since rems will always refer only to the root defined measure – and not to the above element. Our header will act and render as expected.

Download

Copyright Disclaimer:
This site does not store any files on its server. We only index and link to content provided by other sites. Please contact the content providers to delete copyright contents if any and email us, we'll remove relevant links or contents immediately.